<!-- 优惠商品列表 -->
<template>
<div class="preferential-product-list">
  <c-header :title="'优惠商品'"></c-header>
  <div class="pro-list">
    <div class="van-card" v-for="(i,index) in 10" :key="index">
      <div class="van-card__thumb"><img src="https://m.360buyimg.com/n12/jfs/t6214/49/368477431/462778/ead8e3db/593e0a7aN037e4adf.jpg!q70.jpg" class="van-card__img"></div>
      <div class="van-card__content">
        <div class="van-card__row">
          <div class="van-card__title">剑南春 水晶剑 52度 单瓶装白酒 500ml 口感浓香型</div>
        </div>
        <div class="van-card__row">
          <div class="cash">￥100.00+<span class="ykb">100<van-icon name="gold-coin"/></span></div>
          <div class="price">￥100.00</div>
        </div>
      </div>
      <div class="van-card__footer">
        <div><button class="van-button van-button--default van-button--mini"><span class="van-button__text">马上抢</span></button></div>
      </div>
    </div>
  </div>

</div>
</template>

<script>
export default {
  data() {
    return {
      imageURL: 'https://m.360buyimg.com/n12/jfs/t6214/49/368477431/462778/ead8e3db/593e0a7aN037e4adf.jpg!q70.jpg'
    }
  },
  methods: {}
}
</script>

<style lang="scss">
@import '../../assets/styles/common.scss';
.preferential-product-list {
    >.pro-list {
        padding: px2rem(10px) 0;
        .cash {
            font-size: 15px;
            line-height: 20px;
            display: flex;
            flex-direction: row;
            -webkit-align-items: center;
            align-items: center;
            color: #da3142;
        }
        .price {
            font-size: 12px;
            color: #b4b4b4;
            text-decoration: line-through;
        }
        .ykb{
          @include font-dpr(14px);
          display: flex;
          flex-direction: row;
          -webkit-align-items: center;
          align-items: center;
          color: #dec649;
        }
    }
    .van-card__row {
      display: block;
      margin: px2rem(10px) 0;
      line-height: px2rem(30px);
    }
    .van-card {
      height: px2rem(180px);
      padding: 5px 5px 5px 115px;
    }
    .van-button{
      background-color: #da3142;
      color: #fff;
      border-radius: px2rem(60px);
    }
    .van-card__footer{
      bottom: px2rem(30px);
    }
}
</style>
